// import React, {useEffect, useRef, useState} from 'react';
//
// // @ts-ignore
// import {CapsuleChart} from '@jiaminghi/data-view-react';
// import PageContainer from "@ant-design/pro-layout/es/components/PageContainer";
// import "./index.css";
// import {AutoComplete, Card, Col, Form, message, Row, Spin, Switch, Tabs} from "antd";
// import {ProFormDateRangePicker, ProFormSwitch, QueryFilter} from "@ant-design/pro-form";
// import ProTable, {ActionType} from '@ant-design/pro-table';
// import {useRequest} from "@@/plugin-request/request";
// import {hooksSet, modifyJsonArray} from "@/assets/utils/utils";
// import {
//   listDetailsCityUrlStatistics,
//   listDetailsUrlStatistics,
//   listTotal2,
//   listTotalCityUrlStatistics,
//   listTotalUrlStatistics,
//   listUrl,
//   visitBeforeCity,
//   visitBeforeStatistics
// } from "@/pages/analysis/Page/service";
// import {UrlStatistics} from "@/pages/analysis/Page/data";
// // @ts-ignore
// import $ from 'jquery';
// import FormHideItem from "@/assets/components/formHideItem";
// import {getDateString} from "@/assets/utils/dateUtils";
// import moment from "moment";
// import PageAccessTrend from "@/pages/analysis/Page/TabPaneContent/pageAccessTrend";
//
// const PageAnalysisTools: React.FC<{}> = () => {
//
//   const [spinning, setSpinning] = useState(false)
//   const urlStatisticActionRef = useRef<ActionType>();
//   const visitBeforeStatisticActionRef = useRef<ActionType>();
//   const urlStatistic2ActionRef = useRef<ActionType>();
//   const [form] = Form.useForm();
//   form.setFieldsValue(Object.assign({}, {
//     url: "https://wap.jx.10086.cn/hui/login/otherLogin",
//     dateRange: [getDateString("yyyyMMdd"), getDateString("yyyyMMdd")],
//     current: 1,
//     size: 10
//   }, form.getFieldsValue()))
//   // form.setFieldsValue(Object.assign({}, {url: "https://edp963.github.io/davinci/docs/zh/3.1-organization", dateRange: ["20210425", "20210426"], current: 1, size: 10}, form.getFieldsValue()))
//   /**
//    * 当前标签页
//    */
//   const [nowTabPaneKey, setNowTabPaneKey] = useState("1")
//
//   const [urlStatistic, setUrlStatistic] = useState([]);
//   const [visitBeforeStatistic, setVisitBeforeStatistic] = useState([]);
//   const [urlStatistic2, setUrlStatistic2] = useState([]);
//   /**
//    * 显示能匹配上输入框的url列表
//    */
//   const [autoCompleteOption, setAutoCompleteOption] = useState([]);
//
//   /**
//    * 根据当前标签页不同，获取不同的set
//    */
//   const getNowSet = () => {
//     let set;
//     switch (nowTabPaneKey) {
//       case "1":
//         set = setUrlStatistic2
//         break;
//       case "3":
//         set = setVisitBeforeStatistic
//         break;
//       case "4":
//         set = setUrlStatistic
//         break;
//     }
//     return set
//   }
//
//   /**
//    * 根据当前标签页不同，获取不同的actionRef
//    */
//   const getNowActionRef = () => {
//     let actionRef;
//     switch (nowTabPaneKey) {
//       case "1":
//         actionRef = urlStatistic2ActionRef
//         break;
//       case "3":
//         actionRef = visitBeforeStatisticActionRef
//         break;
//       case "4":
//         actionRef = urlStatisticActionRef
//         break;
//     }
//     return actionRef
//   }
//
//   /**
//    * 获取url列表
//    */
//   const [urlList, setUrlList] = useState<{ label: string, value: string }[]>([])
//   useRequest(() => listUrl(), {
//     onSuccess: (result) => {
//       let list: any = []
//       result.forEach((url: string) => {
//         list.push({label: url, value: url})
//       })
//       hooksSet(setUrlList, list)
//     }
//   })
//
//   /**
//    * 直接显示同级11条
//    */
//   const listTotal2Run = useRequest((params?: any, loading?: any) => listTotal2(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       hooksSet(getNowSet(), result, () => {
//         listCityUrlStatisticsRun(Object.assign({}, form.getFieldsValue(), {
//           url: result[0]?.url,
//           key: result[0]?.key
//         }))
//         getNowActionRef()?.current?.reload()
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//         $('<style>.ant-table-row-level-0:first-child{background-color: rgb(197,227,253);}</style>').appendTo('head');
//       })
//     }
//   }).run
//
//   /**
//    * 获取第一层url统计数据
//    */
//   const listTotalUrlStatisticsRun = useRequest((params?: any, loading?: any) => listTotalUrlStatistics(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       hooksSet(getNowSet(), result, () => {
//         listCityUrlStatisticsRun(Object.assign({}, form.getFieldsValue(), {
//           url: result[0]?.url,
//           key: result[0]?.key
//         }))
//         // 刷新
//         getNowActionRef()?.current?.reload()
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//         $('<style>.ant-table-row-level-0:first-child{background-color: rgb(197,227,253);}</style>').appendTo('head');
//       })
//     }
//   }).run
//
//   /**
//    * 获取第二层url统计数据
//    */
//   const listDetailsUrlStatisticsRun = useRequest((params?: any, loading?: any) => listDetailsUrlStatistics(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       hooksSet(setUrlStatistic, modifyJsonArray(urlStatistic, "key", params[0].key, {children: result}), () => {
//         getNowActionRef()?.current?.reload()
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//       })
//     }
//   }).run
//
//   /**
//    * 获取访前分析
//    */
//   const visitBeforeStatisticsRun = useRequest((params?: any, loading?: any) => visitBeforeStatistics(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       hooksSet(setVisitBeforeStatistic, modifyJsonArray(visitBeforeStatistic, "key", params[0].key, {children: result}), () => {
//         getNowActionRef()?.current?.reload()
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//       })
//     }
//   }).run
//
//   /**
//    * 获取地市第一层信息
//    */
//   const [cityData, setCityData] = useState([])
//   const listCityUrlStatisticsRun = useRequest((params?: UrlStatistics, loading?: any) => listTotalCityUrlStatistics(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       let data: any[] = [];
//       result.forEach((n: UrlStatistics) => {
//         data.push({name: n.cityName, value: n.uv})
//       })
//       hooksSet(setCityData, data, () => {
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//       })
//     }
//   }).run
//
//   /**
//    * 获取地市第二层信息
//    */
//   const listDetailsCityUrlStatisticsRun = useRequest((params?: UrlStatistics, loading?: any) => listDetailsCityUrlStatistics(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       let data: any[] = [];
//       result.forEach((n: UrlStatistics) => {
//         data.push({name: n.cityName, value: n.uv})
//       })
//       hooksSet(setCityData, data, () => {
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//       })
//     }
//   }).run
//
//   /**
//    * 获取访前地市信息
//    */
//   const visitBeforeCityRun = useRequest((params?: UrlStatistics, loading?: any) => visitBeforeCity(params), {
//     manual: true,
//     onSuccess: (result, params) => {
//       let data: any[] = [];
//       result.forEach((n: UrlStatistics) => {
//         data.push({name: n.cityName, value: n.uv})
//       })
//       hooksSet(setCityData, data, () => {
//         // 关闭加载中的弹框
//         params[1] && params[1]()
//         // 关闭spanning
//         setSpinning(false)
//       })
//     }
//   }).run
//
//   useEffect(() => {
//     setSpinning(true)
//     listTotal2Run(form.getFieldsValue(), message.loading('正在加载'))
//     // let iframe = window.frames['iframe']
//     // iframe.document.write("<script>alert('1111')<\/script>");
//   }, [])
//
//   return (
//     <PageContainer>
//       <Card>
//         <QueryFilter
//           form={form}
//           onFinish={async (values: any) => {
//             form.setFieldsValue(values)
//             setSpinning(true)
//             // key为3、4的情况
//             if (nowTabPaneKey === "3" || nowTabPaneKey === "4") {
//               listTotalUrlStatisticsRun(form.getFieldsValue(), message.loading('正在加载'))
//             } else if (nowTabPaneKey === "1") {
//               listTotal2Run(form.getFieldsValue(), message.loading('正在加载'))
//             }
//             // 左侧iframe更换
//             $("#iframe").attr("src", values.url.indexOf("http") === -1 ? ("https://" + values.url) : values.url)
//           }}
//         >
//           <Form.Item
//             name="url"
//             label="地址"
//             rules={[{required: true}]}
//             // @ts-ignore
//             colSize={10 / 6}
//           >
//             <AutoComplete
//               options={autoCompleteOption}
//               onSearch={(searchText: string) => {
//                 // 查询出前10个包含searchText的url
//                 let result: any = []
//                 urlList.forEach((url) => {
//                   if (result.length < 10 && (url.value.indexOf(searchText) != -1)) {
//                     result.push(url)
//                   }
//                 })
//                 setAutoCompleteOption(result)
//               }}
//             />
//           </Form.Item>
//           <ProFormDateRangePicker name="dateRange" label="时间区间" rules={[{required: true}]} colSize={5 / 6} fieldProps={{
//             format: "YYYYMMDD",
//             disabledDate: (currentDate) => currentDate && currentDate > moment(getDateString("yyyyMMdd"), 'YYYYMMDD')
//           }}/>
//           <Form.Item label={"是否汇总"} key={"isSum"} name={"isSum"}
//             // @ts-ignore
//                      colSize={0.5}><Switch></Switch></Form.Item>
//           <Form.Item key={"current"} name={"current"} hidden={true}/>
//           <Form.Item key={"size"} name={"size"} hidden={true}/>
//         </QueryFilter>
//       </Card>
//       <Spin spinning={spinning}>
//         <Card>
//           <ProTable
//             columns={[
//               {
//                 dataIndex: 'date',
//                 title: '日期',
//               },
//               {
//                 dataIndex: 'title',
//                 title: '标题',
//               },
//               {
//                 dataIndex: 'url',
//                 title: '地址',
//                 ellipsis: true,
//               },
//               {
//                 dataIndex: 'pv',
//                 title: 'pv',
//                 width: 100
//               },
//               {
//                 dataIndex: 'uv',
//                 title: 'uv',
//                 width: 100
//               }
//             ]}
//             actionRef={urlStatistic2ActionRef}
//             // pagination={{
//             //   pageSize: 10,
//             //   onChange: (page, pageSize) => {
//             //     form.setFieldsValue({current: page, size: pageSize})
//             //     setSpinning(true)
//             //     listTotalUrlStatisticsRun(form.getFieldsValue(), message.loading('正在加载'))
//             //   }
//             // }}
//             pagination={false}
//             search={false}
//             toolBarRender={false}
//             request={() => {
//               return Promise.resolve({
//                 data: urlStatistic2,
//                 success: true
//               })
//             }}
//             // expandable={{
//             //   onExpand: (expanded, record: any) => {
//             //     // 展开时，查询子节点
//             //     if (expanded) {
//             //       setSpinning(true)
//             //       listTotal2Run(Object.assign({}, form.getFieldsValue(), {
//             //         url: record.url,
//             //         key: record.key
//             //       }), message.loading('正在加载'))
//             //     }
//             //   }
//             // }}
//             onRow={(record: any, index) => {
//               return {
//                 // 获取地市信息
//                 onClick: (event) => {
//                   // 左侧iframe更换
//                   $("#iframe").attr("src", record.url.indexOf("http") === -1 ? ("https://" + record.url) : record.url)
//                   // 删除默认设置的高亮，伪类
//                   $('<style>.ant-table-row-level-0:first-child{background-color: white;}</style>').appendTo('head');
//                   // @ts-ignore以前设置的长亮取消
//                   $(".ant-table-row").each((i, n) => {
//                     $(n).css("background-color", "")
//                   })
//                   // @ts-ignore设置背景长亮
//                   $("[data-row-key='" + record.key + "']").css("background-color", "rgb(197,227,253)")
//                   // 获取地市信息
//                   setSpinning(true)
//                   listDetailsCityUrlStatisticsRun(Object.assign({}, form.getFieldsValue(), {
//                     url: record.url,
//                     key: record.key
//                   }), message.loading('正在加载'))
//                 }
//               }
//             }}
//           />
//         </Card>
//       </Spin>
//     </PageContainer>
//   );
// };
//
// export default PageAnalysisTools;

// rowSelection={{
//   checkStrictly: false,
//     onChange: (selectedRowKeys, selectedRows: PageAnalysis[]) => {
//     let temCheckedParams: any[] = [];
//     // 收集参数
//     selectedRows?.forEach((row) => {
//       temCheckedParams.push(row.urlParams)
//     })
//     // 遍历去除：数组里有不带=号的（即全选key下的所有value值）的单个key=value，例：checkedParams=["param1", "param1=1", "param1=2".....]，去除param1=1和param1=2
//     if(temCheckedParams.length > 0){
//       let checkedParams: any[] = [];
//       temCheckedParams?.forEach((tem)=>{
//         if(tem?.indexOf("=") !== -1){
//           if(temCheckedParams?.indexOf(tem.split("=")[0]) === -1){
//             checkedParams.push(tem)
//           }
//         }else {
//           checkedParams.push(tem)
//         }
//       })
//       // 如果选中的key=value比同级未选中的个数多，则转为排除参数（应对100个中选中99个，则需要传99个参数的情况）
//       let exceptParams: any[] = [];
//       // 收集key=value，按key分组
//       let checkedParamsGroup: {} = {};
//       checkedParams.forEach((param)=>{
//         if(param.indexOf("=") !== -1){
//           let key = param.split("=")[0]
//           if(!checkedParamsGroup.hasOwnProperty(key)){
//             checkedParamsGroup[key] = []
//           }
//           checkedParamsGroup[key].push(param)
//         }
//       })
//       // checkedParams对比allUrlParamsList，在相同key的情况下，如果未选中的比选中的少，则params中去掉该组参数，exceptParams中插入未选中
//       a:for(let key in checkedParamsGroup){
//         // 获取allUrlParamsList中该组参数
//         let allUrlParams:any[] = [];
//         allUrlParamsList?.forEach((n)=>{
//           b:if(key === n.urlParams){
//             allUrlParams = n.children || []
//             break b;
//           }
//         })
//         // 获取该组参数总个数
//         let allUrlParamsCount = allUrlParams.length
//         // 判断选中的参数是否超过总数一半，超过则改为exceptParams中插入未选中
//         if(checkedParamsGroup[key].length > allUrlParamsCount / 2.0){
//           allUrlParams?.forEach((param)=>{
//             // 判断该param是否已选中
//             let index = checkedParams.indexOf(param.urlParams)
//             if(index !== -1){
//               // 已选中
//               checkedParams.splice(index, 1)
//             }else {
//               // 未选中
//               exceptParams.push(param.urlParams)
//             }
//           })
//         }
//       }
//     }
//   }
// }}
// <div className="card-container" style={{paddingTop: '24px'}}>
//   <Tabs defaultActiveKey="1" type="card" onTabClick={(key) => {
//     hooksSet(setNowTabPaneKey, key, () => {
//       // key为3、4的情况
//       if (key === "3" || key === "4") {
//         setSpinning(true)
//         listRun(form.getFieldsValue(), message.loading('正在加载'))
//       }
//       // else if (key === "1") {
//       //   setSpinning(true)
//       //   listTotal2Run(form.getFieldsValue(), message.loading('正在加载'))
//       // }
//     })
//   }}>
//
//     <Tabs.TabPane tab="访前分析" key="3">
//       <Row style={{height: "100%"}}>
//         <Col span={12}>
//           <ProTable
//             columns={[
//               {
//                 dataIndex: 'title',
//                 title: '',
//                 width: 30,
//                 renderText: (_, __, index) => " ",
//               },
//               // {
//               //   dataIndex: 'title',
//               //   title: '标题',
//               //   width: 200,
//               //   renderText:()=>"-"
//               // },
//               {
//                 dataIndex: 'url',
//                 title: 'url',
//                 ellipsis: true,
//               },
//               {
//                 dataIndex: 'pv',
//                 title: 'pv',
//                 width: 100
//               },
//               {
//                 dataIndex: 'uv',
//                 title: 'uv',
//                 width: 100
//               }
//             ]}
//             actionRef={visitBeforeStatisticActionRef}
//             pagination={{
//               pageSize: 10,
//               total: 1000,
//               onChange: (page, pageSize) => {
//                 form.setFieldsValue({current: page, size: pageSize})
//                 setSpinning(true)
//                 listRun(form.getFieldsValue(), message.loading('正在加载'))
//               }
//             }}
//             search={false}
//             toolBarRender={false}
//             request={() => {
//               return Promise.resolve({
//                 data: visitBeforeStatistic,
//                 success: true
//               })
//             }}
//             expandable={{
//               onExpand: (expanded, record: any) => {
//                 // 展开时，查询子节点
//                 if (expanded) {
//                   setSpinning(true)
//                   listVisitBeforeRun(Object.assign({}, form.getFieldsValue(), {
//                     url: record.url,
//                     key: record.key
//                   }), message.loading('正在加载'))
//                 }
//               }
//             }}
//             onRow={(record: PageParamAnalysis, index) => {
//               return {
//                 // 获取地市信息
//                 onClick: (event) => {
//                   // 左侧iframe更换
//                   // @ts-ignore
//                   $("#iframe").attr("src", record.url.indexOf("http") === -1 ? ("https://" + record.url) : record.url)
//                   // 删除默认设置的高亮，伪类
//                   $('<style>.ant-table-row-level-0:first-child{background-color: white;}</style>').appendTo('head');
//                   // @ts-ignore以前设置的长亮取消
//                   $(".ant-table-row").each((i, n) => {
//                     $(n).css("background-color", "")
//                   })
//                   // @ts-ignore设置背景长亮
//                   $("[data-row-key='" + record.key + "']").css("background-color", "rgb(197,227,253)")
//                   // 获取地市信息
//                   if (record.isChild) {
//                     setSpinning(true)
//                     listVisitBeforeCityRun(Object.assign({}, form.getFieldsValue(), {
//                       url: record.url,
//                       parentUrl: record.parentUrl,
//                       key: record.key
//                     }), message.loading('正在加载'))
//                   } else {
//                     setSpinning(true)
//                     listCityRun(Object.assign({}, form.getFieldsValue(), {
//                       url: record.url,
//                       key: record.key
//                     }), message.loading('正在加载'))
//                   }
//                 }
//               }
//             }}
//           />
//         </Col>
//         <Col span={12}>
//           {cityData && <CapsuleChart config={{data: cityData, unit: "uv", showValue: true}}
//                                      style={{width: "500px", height: "500px"}}/>}
//         </Col>
//       </Row>
//     </Tabs.TabPane>
//   </Tabs>
// </div>
